<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/jsp/comm_css_include.jsp"%>
<!-- jqgrid-->
<link href="${basePath}/css/plugins/jqgriddemo/css/ui.jqgrid-bootstrap.min.css" rel="stylesheet" />
<!doctype html>
<html>
<head>
</head>
<body class="gray-bg">
	<div class="wrapper wrapper-content animated fadeInRight creditbody">
		<div class="iboxtitle">
			<span><i class="glyphicon glyphicon-map-marker"></i>&nbsp;</span>
			<a href="javascript:void(0)"></a>
		</div>
		<div class="ibox-content">
			<button type="button" class="btn dpbtn_green" onclick="add();">新增</button>
		</div>
		<div class="ibox-content">
			<div role="form" class="form-inline">
				<div class="form-group">
					<select id="query_bankCode" class="select-control" style="max-width: 206px;"></select>
				</div>
				<button class="zhixcx" type="button" onclick="query();">执行查询</button>
			</div>
		</div>
		<div class="ibox-content">
			<div class="jqGrid_wrapper">
				<table id="table_list_1"></table>
				<div id="pager_list_1"></div>
			</div>
		</div>
	</div>

	<div id="moneyset" style="display: none;">
		<form class="form-horizontal m-t" id="commentForm">
			<div class="business-padding">
				<div class="form-group">
					<label class="col-sm-4 control-label">银行名称：</label>
					<div class="col-sm-8">
						<select id="bankCode" name="bankCode" class="select-control" required="required"></select>
					</div>
				</div>

				<div class="form-group">
					<input type="hidden" id="id" name="id" /> 
					<label class="col-sm-4 control-label">贷款期数(月)：</label>
					<div class="col-sm-8">
						<select id="monthNum" name="monthNum" class="select-control" required="required"></select>
					</div>
				</div>

				<div class="form-group">
					<label class="col-sm-4 control-label">银行利率(%)：</label>
					<div class="col-sm-8">
						<input id="bankRate" name="bankRate" minlength="1" maxlength="64" type="number" class="form-control" required="" aria-required="true" placeholder="银行利率(必填)">
					</div>
				</div>

				<div class="form-group">
					<label class="col-sm-4 control-label">排序：</label>
					<div class="col-sm-8">
						<input id="sortValue" name="sortValue" minlength="1" maxlength="64" type="number" class="form-control" aria-required="true" placeholder="排序">
					</div>
				</div>
				
				<div class="form-group">
					<label class="col-sm-4 control-label">备注：</label>
					<div class="col-sm-8">
						<textarea id="remarks" name="remarks"  class="form-control" ></textarea>
					</div>
				</div>
				
				<table cellpadding="0" cellspacing="0" border="0"
					bordercolor="#3B95C8" width="100%">
					<tr>
						<td width="100%" align="center">
							<div class="ibox-content">
								<button type="button" class="btn dpbtn_green" onclick="save();">确定</button>
								<button type="button" class="btn dpbtn_red" onclick="reset();">重置</button>
							</div>
						</td>
					</tr>
				</table>
			</div>
		</form>
	</div>

	<!-- public quote -->
	<%@include file="/jsp/comm_js_include.jsp"%>
	<!-- jqGrid -->
	<script type="text/javascript" charset="utf-8" src="${basePath}/js/plugins/jqgriddemo/js/jquery.jqGrid.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="${basePath}/js/plugins/jqgriddemo/js/grid.locale-cn.min.js"></script>

	<script type="text/javascript">

	jQuery(function ($) {
	    getData();
	    getEnums();
	});
	
	var getEnums = function () {
		$.dpAjax({
			show:false,
    		url:'${basePath}/DataDictionaryController/getEnableList',
			data:{ "parentValue":"LoanBank" },
			success: function(datas){
				var result = datas.result.rows;
				var html = '<option value="">请选择...</option>';
				var queryhtml = '<option value="">全部</option>';
				if(result && result.length && result.length > 0) {
				      for(var i = 0;i < result.length; i++){
				          var programme = result[i];
				          html += '<option value="' + programme.value + '">' + programme.name + '</option>';
				          queryhtml += '<option value="' + programme.value + '">' + programme.name + '</option>';
				      }
				 }
				$("#query_bankCode").html(queryhtml);
				$("#bankCode").html(html);
          }
    	});
		$.dpAjax({
				show:false,
	    		url:'${basePath}/DataDictionaryController/getEnableList',
				data:{ "parentValue":"LoanMonth" },
				success: function(datas){
					var result = datas.result.rows;
					var html = '<option value="">请选择...</option>';
					if(result && result.length && result.length > 0) {
					      for(var i = 0;i < result.length; i++){
					          var programme = result[i];
					          html += '<option value="' + programme.value + '">' + programme.name + '</option>';
					      }
					 }
					$("#monthNum").html(html);
	          }
    	});
	}
	
	var getData = function () {
  var winWidth = $('div.ibox-content').width();
   	    winHeight = document.body.offsetHeight - 400;
	    var win = winWidth / 7 - 20;
        $.jgrid.defaults.styleUI = 'Bootstrap';
        jQuery("#table_list_1").jqGrid
        ({
            url: '${basePath}/OtherBankRateController/list',//换个接口
            datatype: "json",
            colNames: ['主键','银行名称','银行', '贷款期数(月)', '贷款期数','利率(%)','排序','备注'],
            colModel: [
				{name: 'replaceId', index: 'id', hidden:true},
				{name: 'bankCodeDisplay', index: 'bankCode', width: 100, align: "center"},
                {name: 'bankCode', index: 'bankCode', hidden:true},
                {name: 'monthNumDisplay', index: 'monthNum', width: 100, align: "center"},
                {name: 'monthNum', index: 'monthNum', hidden:true},
                {name: 'bankRate', index: 'bankRate', width: 80, align: "center",formatter:function(a,b,c){
                	return showNumber(a ? (a * 100) : 0 , 4);
                }},
                {name: 'sortValue', index: 'sortValue', width: 80, align: "center"},
                {name: 'remarks', index: 'remarks', hidden:true}
            ],
            mtype: "post",
            height: winHeight,
            width:winWidth,  
            autowidth: true,
            shrinkToFit: true,
            rowNum: 15,
            sortorder : "asc",
            sortname : 'sortValue',
            rowList: [15, 30, 45],
            viewrecords: true,
            pager: "#pager_list_1",
            hidegrid: false,
            multiselect: true,
            altRows:true,
            altclass:'someClass',
            ondblClickRow:function(rowId,v,e)
            {
	          	  var rowData = $("#table_list_1").jqGrid("getRowData", rowId);
	          	  var id = rowData.replaceId;
	          	  $("#id").val(id);
	          	  $('#bankCode').val(rowData.bankCode);
	          	  $('#monthNum').val(rowData.monthNum);
	          	  $('#bankRate').val(rowData.bankRate);
	          	  $('#sortValue').val(rowData.sortValue);
	          	  $('#remarks').val(rowData.remarks);
	          	  updateLayer =  layer.open({
	  		    	  type: 1,
	  		    	  title: '修改银行利率',
	  		    	  shadeClose: true,
	  		    	  shade: 0.8,
	  		    	  area: ['450px', '45%'],
	  		    	  content: $("#moneyset"),
	  		    	  end: function () 
	  		    	  {
	  		    		  refresh();
	  		          }
	  	    	});  	  
            },
            jsonReader: {
                root: "result.rows",
                page: "result.page",
                total: "result.total",
                records: "result.records",
                repeatitems: false,
                id: "replaceId"
            },
            loadComplete:function(datas){
          	  if (datas.flag == "100100") {
                    layer.msg("查询成功!", {icon: 6, time: 1000});
                    return;
                }
          	  if(datas.flag == '100802') {
  				  top.location.href = thisLoginUrl;
  				  return;
  			  }

          	  layer.msg(datas.message, {icon: 2});
            }
        });
    }
	
	
    //条件搜索
    var query = function()
    {
    	var postData = $("#table_list_1").jqGrid("getGridParam", "postData");
    	var query_bankCode = document.getElementById('query_bankCode').value || '';
    	$.extend(postData, { bankCode : query_bankCode });
    	refresh();
    }

    //新增
    var addlayer;
    var add = function () {
    	reset();
    	addlayer=layer.open({
            type: 1,
            title: '新增银行利率',
            shadeClose: true,
            shade: 0.8,
            area: ['450px', '45%'],
            content: $("#moneyset"),
            end: function () {
                refresh();
            }
        });
    }
    
    //保存
    var save = function(){
    	var data = {};
    	data.id = $('#id').val();
    	data.bankCode = $('#bankCode').val();
    	data.monthNum = $('#monthNum').val();
    	data.bankRate = $('#bankRate').val() / 100;
    	data.sortValue = $('#sortValue').val();
    	data.remarks = $('#remarks').val();
    	var validstatus = $("#commentForm").valid();
	    if(validstatus){
	    	$.dpAjax({
	        	url: '${basePath}/OtherBankRateController/save',//表单接口需要换
	            data: data,
	            success: function (datas) {
	            	layer.msg('保存成功', {icon: 6});
	            	setTimeout(function(){
	            		layer.closeAll();
	            		refresh();
	            	}, 1500);
	                return;
	            }
	        });
	    }	
    }
	
    var refresh = function () {
        $("#table_list_1").jqGrid("setGridParam", {search: true}).trigger("reloadGrid", [{page: 1}]);
    }
    
    function reset(){
    	  $("#id").val('');
    	  $('#bankCode').val('');
    	  $('#monthNum').val('');
    	  $('#bankRate').val('');
    	  $('#sortValue').val('');
    	  $('#remarks').val('');
    }
    
    $(function(){
    	$("#commentForm").validate({
    		rules:{
    			bankRate:{
    				floatmoney:true,
    				max:100
    			},
    			sortValue:{
    				zhengZS:true
    			}
    		},
            //重写showErrors
            showErrors: function (errorMap, errorList) {
                
                $.each(errorList, function (i, v) {
                    layer.tips(v.message, v.element, { time: 1500 });
                    return false;
                });  
            },
            /* 失去焦点时验证 */
            onfocusout: function(element) { $(element).valid(); },
            /*  键盘抬起不验证 */
            onkeyup:false,
        }); 
    });
</script>
</body>
</html>
